<template>
  <TableList :data="data" @showAddDialog="showAddDialog" @showEditDialog="showEditDialog"></TableList>

  <!-- 添加表单 -->
  <AddForm :visiable="addVisiable" @closeAddDialog="closeAddDialog" @refresh="loadPlan"></AddForm>

  <!-- 编辑表单 -->
  <EditForm :visiable="editVisiable" @closeEditDialog="closeEditDialog" :addFormData="editData"></EditForm>
</template>

<script setup lang="ts">
import { findById, getList } from '@/api/nursing_plan_api';
import TableList from './components/TableList.vue';
import { onMounted, ref } from 'vue';
import AddForm from './components/AddForm.vue';
import EditForm from './components/EditForm.vue';

// TableList显示需要的数据
const data = ref([])
// 编辑需要回显的数据
const editData = ref({})
const addVisiable = ref(false)
const editVisiable = ref(false)
// 添加对话框的显示和隐藏
const showAddDialog = () => {
  addVisiable.value = true
}
const closeAddDialog = () => {
  addVisiable.value = false
}
// 编辑对话框的显示和隐藏
const showEditDialog = async (id) => {
  editVisiable.value = true

  // 查询回显数据，项目计划editData
  let resp = await findById(id)

  editData.value = resp
}
const closeEditDialog = () => {
  editVisiable.value = false

  // 清空editData
  editData.value = []
}


onMounted(() => {
  loadPlan()
})


const loadPlan = async () => {
  let resp = await getList()
  data.value = resp.records
}

</script>



<style lang="less" scoped></style>